<!--
 * @Author: Bobby
 * @Date: 2021-12-30 10:01:42
 * @LastEditTime: 2022-03-10 18:05:06
 * @LastEditors: Bobby
 * @Description:
 * @FilePath: \wms-v2\src\ve\elements\form\uiSelectLayer\uiSelectLayer.vue
 * CIMC-V2
-->
<template>
  <UiFormItem :info="info">
    <div class="ui-select-layer leading-8 w-full inline-block">
      <div class="select-bar h-full border border-gray-300 w-full px-1 bg-white cursor-pointer" @click="onClick">
        <input :ref="info._id" v-model="formDataModel" v-ui-ref="vSetRef" class="hidden" disabled />
        <div class="flex justify-between">
          <div class="text-xs text-gray-600 flex items-center">{{ label }}</div>
          <div class="w-5 text-gray-500"><vui-icon class="block" icon="more-fill" /></div>
        </div>
      </div>
    </div>
  </UiFormItem>
</template>
<script>
  import { defineComponent } from 'vue'
  import { UiMixin, ElementsFormMixin, RefsInjectMixin, ConditionMixin } from '@ve/mixin'
  export default defineComponent({
    name: 'UiSelectLayer',
    components: {},
    mixins: [UiMixin, ElementsFormMixin, RefsInjectMixin, ConditionMixin],
    data() {
      return {
        label: '',
      }
    },
    created() {},
    methods: {
      setLabel(label) {
        this.label = label
      },
    },
  })
</script>
<style scoped>
  .ui-select-layer {
    padding-top: 1px;
    height: 27px;
  }
  .select-bar {
    line-height: 26px;
    border-radius: 2px;
  }
</style>
